<script setup>
import { onMounted} from "vue";
import PDFViewReader from 'pdf-view-reader';
  const viewer = new PDFViewReader();
onMounted(() => {
  document.getElementById('fileInput').addEventListener('change', function (event) {
    const file = event.target.files[0];
    if (file) {
      // 预览 PDF
      // viewer.readOrPreviewPdf(file, 'view', (text) => {
      //   console.log("PDF preview:", text);
      //   // 'text' 在预览模式下通常不使用，因为预览是直接在 DOM 中渲染的
      // }, (error) => {
      //   console.error('Error previewing PDF:', error);
      // }, 'content'); // 预览容器的 ID

      // 或者读取 PDF 文本内容
      // viewer.readOrPreviewPdf(file, 'read', (text) => {
      //     console.log("PDF Text:", text);
      //     document.getElementById('content').innerHTML = text;
      // }, (error) => {
      //     console.error('Error reading PDF:', error);
      // });
      viewer.readDocx(file, (data) => {
        console.log("readDocx Text data:", data.text);
        document.getElementById('content').innerHTML = data.text;
      }, (error) => {
        console.error('Error reading DOCX:', error);
      });
    }
  });
})

</script>

<template>
  <div>
    <input type="file" id="fileInput">
    <div id="content"></div>
  </div>

</template>

<style scoped>

</style>